<!--********************************************************************
* by jiawanlong
*********************************************************************-->
<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <link rel="stylesheet" href="./../../cesium/Cesium1.98/Widgets/widgets.css" />
  <script type="text/javascript" src="./../../cesium/Cesium1.98/Cesium.js"></script>
</head>

<body style="
      margin: 0;
      overflow: hidden;
      background: #fff;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
    ">
  <div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>

  <script type="text/javascript">
    Cesium.Ion.defaultAccessToken =
      "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3ZjQ5ZGUzNC1jNWYwLTQ1ZTMtYmNjYS05YTY4ZTVmN2I2MDkiLCJpZCI6MTE3MTM4LCJpYXQiOjE2NzY0NDUyODB9.ZaNSBIfc1sGLhQd_xqhiSsc0yr8oS0wt1hAo9gbke6M";
    const viewer = new Cesium.Viewer("map", {});
    viewer.scene.debugShowFramesPerSecond = true;

    // http://cesium.xin/cesium/cn/Documentation1.95/CylinderGraphics.html#.ConstructorOptions

    const cylinderEntity = new Cesium.Entity({
      position: Cesium.Cartesian3.fromDegrees(-100, 30, 150),
      cylinder: {
        material: Cesium.Color.fromCssColorString("rgba(255,240,0, 0.35)"),
        length: 100, //圆柱体的长度
        topRadius: 0, //顶部半径
        bottomRadius: 30,
      }
    })
    viewer.entities.add(cylinderEntity);

    var position = Cesium.Cartesian3.fromDegrees(-100.001, 30, 150);
    var heading = Cesium.Math.toRadians(0);
    var pitch = Cesium.Math.toRadians(120);
    var roll = Cesium.Math.toRadians(0);
    var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
    var orientation = Cesium.Transforms.headingPitchRollQuaternion(
      position,
      hpr
    );
    const cylinderEntity1 = new Cesium.Entity({
      position: position,
      orientation: orientation,
      cylinder: {
        fill: false,
        outline: true,
        outlineWidth: 5,
        outlineColor: Cesium.Color.fromCssColorString("rgba(255,240,0, 0.35)"),
        length: 100, //圆柱体的长度
        topRadius: 0, //顶部半径
        bottomRadius: 30,
      }
    })
    viewer.entities.add(cylinderEntity1);

    viewer.flyTo(viewer.entities)

  </script>
</body>

</html>